// 引入 react 依赖
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Text, View, Image, TouchableOpacity, ImageBackground, ScrollView } from 'react-native';

// 引入第三方依赖
import _ from 'lodash';
import pureRender from 'pure-render-decorator';

// antd 按需加载
import { } from 'antd-mobile-rn';

// 引入 处理数据 所需文件
import { } from './module.js'

// 引入样式
import Styles from './style.js';
import PublicStyle from '../../style/style.js';;

// 引入公用组件
import { Results } from '../../components/index.js'

// 引入工具包
import { press, size, ScreenWidth, defaultDataList, onEndReached, onRefresh, concatDataList, defaultPage } from '../../util/utils.js'
class LoadingData extends Component {
	static propTypes = {

	}

	constructor(props) {
		super(props)
		this.state = {
			loading: false,
			error: false,
			success: false,
			empty: false
		}
	}

	componentDidMount() {
		const { request, data, rowItem } = this.props
		this.setState({
			loading: true,
			error: false,
			success: false,
			empty: false,
		})
		this.handleRequest()
	}

	handleRequest() {
		const { request, data, rowItem } = this.props
		this.setState({
			loading: true,
			error: false,
			success: false,
			empty: false,
		})
		request().then(res => {
			if (res.data.length == 0) {
				this.setState({
					loading: false,
					error: false,
					success: false,
					empty: true,
				})
			} else {
				this.setState({
					loading: false,
					error: false,
					success: true,
					empty: false,
				})
			}
		}).catch(error => {
			console.log(error)
			console.log("请求失败")
			this.setState({
				loading: false,
				error: true,
				success: false,
				empty: false,
			})
		})
	}

	render() {
		const { loading, error, success, empty } = this.state
		const { data, rowItem, style, type, scroll } = this.props
		if (loading) {
			return <Results type='loading' width={size(500)} height={size(200)} />
		}
		if (error) {
			return <Results type='error' width={size(500)} height={size(200)} />
		}
		if (empty) {
			return <Results type='data' width={size(500)} height={size(200)} />
		}
		if (success) {
			if (!type) {
				return (
					<View style={Styles.container} style={style}>
						{data.map((item, index) => rowItem(item, index))}
					</View>
				)
			}
			if (type == 'scroll') {
				return (
					<ScrollView {...scroll}>
						{data.map((item, index) => rowItem(item, index))}
					</ScrollView>
				)
			}

		}
		return null
	}
}

export default pureRender(LoadingData)
